import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:high_help_apps/common/values/colors.dart';
import 'package:high_help_apps/common/widgets/common/common_button.dart';

import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:high_help_apps/common/widgets/common/common_text_button.dart';
import 'package:high_help_apps/common/widgets/common/paper_tip.dart';
import 'sign_up_logic.dart';
import 'sign_up_state.dart';

class SignUpPage extends StatefulWidget {
  @override
  _SignUpPageState createState() => _SignUpPageState();
}

class _SignUpPageState extends State<SignUpPage> {
  final SignUpLogic logic = Get.put(SignUpLogic());
  final SignUpState state = Get.find<SignUpLogic>().state;

  /// 用户名处理器
  TextEditingController usernameController = new TextEditingController(text: 'huanghai');
  /// 密码处理器
  TextEditingController passwordController = new TextEditingController(text: '123456');
  /// 确认密码处理器
  TextEditingController rePasswordController = new TextEditingController(text: '123456');

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.white,
        body: Stack(
          children: [_buildBackgroundImage(), _buildLoginBox()],
        ));
  }

  Widget _buildBackgroundImage() => Container(
    height: 1.0.sh,
    width: 1.0.sw,
    decoration: BoxDecoration(
        image: DecorationImage(
            image:
            AssetImage('assets/images/signin/sign_in_background.jpg'),
            fit: BoxFit.cover)),
  );

  Widget _buildLoginBox() => Positioned(
    bottom: 0,
    child: Container(
      width: 1.0.sw,
      height: 500.h,
      padding:
      EdgeInsets.only(left: 20.r, right: 20.r, top: 50.r, bottom: 25.r),
      decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
              topLeft: Radius.circular(30), topRight: Radius.circular(30))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildRegisterBoxHeaderTip(),
          SizedBox(
            height: 10.h,
          ),
          _buildFormBox(),
          _buildLoginRow()
        ],
      ),
    ),
  );

  /// 头部提示
  Widget _buildRegisterBoxHeaderTip() => PageHeaderTip(
    margin: EdgeInsets.zero,
    padding: EdgeInsets.zero,
    title: '注册',
    subtitle: '你好, 欢迎来到嗨助校园',
    child: Image.asset('assets/images/signup/user_register.png'),
  );

  /// 构建中间注册表单
  Widget _buildFormBox() => Column(
      children: <Widget>[
        TextField(
            autofocus: false,
            controller: usernameController,
            decoration: InputDecoration(
              hintText: "用户名",
              prefixIcon: Icon(Icons.account_circle_outlined, color: AppColors.primaryElement,),
              enabledBorder: UnderlineInputBorder(
                borderSide: BorderSide(
                  color: AppColors.subTextColor,
                ),
              ),
              focusedBorder: UnderlineInputBorder(
                borderSide: BorderSide(
                  color: AppColors.primaryElement,
                ),
              ),
            ),
            cursorColor: AppColors.subTextColor),
        TextField(
            autofocus: false,
            controller: passwordController,
            decoration: InputDecoration(
              prefixIcon: Icon(Icons.lock, color: AppColors.primaryElement,),
              hintText: "密码",
              enabledBorder: UnderlineInputBorder(
                borderSide: BorderSide(
                  color: AppColors.subTextColor,
                ),
              ),
              focusedBorder: UnderlineInputBorder(
                borderSide: BorderSide(
                  color: AppColors.primaryElement,
                ),
              ),
            ),
            cursorColor: AppColors.subTextColor,
            obscureText: true,
        ),
        TextField(
            autofocus: false,
            controller: rePasswordController,
            decoration: InputDecoration(
              hintText: "确认密码",
              prefixIcon: Icon(Icons.lock, color: AppColors.primaryElement,),
              enabledBorder: UnderlineInputBorder(
                borderSide: BorderSide(
                  color: AppColors.subTextColor,
                ),
              ),
              focusedBorder: UnderlineInputBorder(
                borderSide: BorderSide(
                  color: AppColors.primaryElement,
                ),
              ),
            ),
            cursorColor: AppColors.subTextColor,
            obscureText: true
        ),
        // 登录按钮
        Padding(
          padding: EdgeInsets.only(top: 24.h),
          child: _buildRegisterButton(),
        )
      ],
  );

  /// 构建注册按钮
  Widget _buildRegisterButton() => CommonTextButton(
    padding: EdgeInsets.only(bottom: 15.h),
    onPressed: () => logic.registerUser(usernameController.text, passwordController.text, rePasswordController.text),
    borderRadius: 12.r,
    title: '注册'
  );

  /// 构建登录按钮
  Widget _buildLoginRow() => Row(
    crossAxisAlignment: CrossAxisAlignment.center,
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      _buildAlreadyAccountTip(),
      _buildLoginButton()
    ],
  );

  /// 构建已经有账号的提示
  Widget _buildAlreadyAccountTip() => Padding(
    padding: EdgeInsets.all(15.r),
    child: Text(
      '已经有账号了?立刻登录!',
      style: TextStyle(
        color: AppColors.subTextColor,
        fontSize: 13.5.sp
      ),
    ),
  );

  /// 构建登录按钮
  Widget _buildLoginButton() => CommonTextButton(
    width: 0.3.sw,
    padding: EdgeInsets.only(top: 15.h),
    border: Border.all(color: AppColors.subTextColor12, width: 2.r),
    onPressed: logic.redirectLoginPage,
    borderRadius: 12.r,
    title: '登录',
    textColor: Colors.black,
    backgroundColor: Colors.white,
  );
  @override
  void dispose() {
    Get.delete<SignUpLogic>();
    usernameController.dispose();
    passwordController.dispose();
    rePasswordController.dispose();
    super.dispose();
  }
}